.social {
    /* background: $gold; */
    padding: em(2) 0;
    margin: em(10) 0;
    @include media($breakpoint-xs) {
        @include span-columns(2);
    }
    @include media($breakpoint-s) {
        @include span-columns(4);
    }
    @include media($breakpoint-m) {
        @include span-columns(11);
        @include shift(1);
    }
    @include media($breakpoint-l) {
        @include span-columns(10);
        @include shift(2);
    }
    @include media($breakpoint-xl) {
        @include span-columns(8 of 12);
        @include shift(2);
    }
    @include media($breakpoint-xxl) {
        @include span-columns(12 of 24);
    }
    &-icon {
        line-height: 2em;
        margin-bottom: 2em;
        backgroud-position: top left;
        background-repeat: no-repeat;
    }
}